<template>
    <div id="tmpl">
        <ul class="mui-table-view">
            <!--静态界面-->
            <li class="mui-table-view-cell mui-media" v-for="(item,index) in list" :key="index">
                <router-link v-bind='{to:"./newsinfo/"+item.id}'>
                    <img class="mui-media-object mui-pull-left" :src="item.img_url">
                    <div class="mui-media-body">
                        <span>{{item.title}}</span>
                        <p class='mui-ellipsis'>{{item.zhaiyao}}</p>
                        <div class="ft">
                            <span>发表日期：{{item.add_time | datefmt("YYYY-MM-DD HH:mm:ss")}}</span>
                            <span class="click">点击数：{{item.click}}</span>
                        </div>
                    </div>
                </router-link>
            </li>
        </ul>
    </div>
</template>

<script>
    import common from "../../kits/common.js"
   export default{
        data(){
            return {
                list:[]
            }
   },
        created(){
       this.getnews();
   },
        methods:{
            getnews:function(){
                var url=common.domain+"/api/getnewslist";
                this.$http.get(url).then(function(response){
                    var data=response.body;
                    if(data.status!=0){
                        Toast(data.message);
                    }
                    this.list=data.message;
                })
            }
        }
   }
</script>

<style scoped>
.mui-table-view img {
    width: 80px;
    height: 80px;
}

.mui-table-view .mui-media-object {
    max-width: 80px;
    line-height: 80px;
}

.ft {
    margin-top: 1.5em;
    font-size: 14px;
    color: #0094ff;
}

.ft .click {
    margin-left: 20px;
}
</style>
